Skip to content
This repository was archived by the owner on May 15, 2026. It is now read-only.

Fix: Adjust padding in chat view for better UI#2965

Merged
mrubens merged 2 commits into
RooCodeInc:mainfrom
zhangtony239:zhangtony239
Apr 30, 2025
Merged

Fix: Adjust padding in chat view for better UI#2965
mrubens merged 2 commits into
RooCodeInc:mainfrom
zhangtony239:zhangtony239

Conversation

@zhangtony239

@zhangtony239 zhangtony239 commented Apr 26, 2025

Copy link
Copy Markdown
Contributor

Context

Adjust minimum padding for history card to accommodate small width layouts.

Screenshots

before after
image image

How to Test

  • Run this version
  • You'll notice the changes directly on the Roo Code homepage

Get in Touch

Discord: zhangtony239


Important

Adjust padding in ChatView.tsx for better UI on small width layouts.

  • UI Adjustment:
    • Adjust padding in ChatView.tsx from p-10 to p-3.5 for better accommodation of small width layouts.

This description was created by Ellipsis for 44154d50e5f0687af12a6d3734c30eb8f4e362ba. You can customize this summary. It will automatically update as commits are pushed.

@changeset-bot

changeset-bot Bot commented Apr 26, 2025

Copy link
Copy Markdown

⚠️ No Changeset found

Latest commit: d1ca3d7

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

This PR includes no changesets

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

@dosubot dosubot Bot added the size:XS This PR changes 0-9 lines, ignoring generated files. label Apr 26, 2025
@cte

cte commented Apr 26, 2025

Copy link
Copy Markdown
Contributor

CC @sachasayan

@sachasayan

sachasayan commented Apr 28, 2025

Copy link
Copy Markdown
Contributor

@zhangtony239 I think padding is useful to give the content some room to breathe on larger widths. Let's try some variation of p-3.5 sm:p-10 — does that sound about right for you?

@hannesrudolph hannesrudolph moved this from New to PR [Pre Approval Review] in Roo Code Roadmap Apr 28, 2025
@zhangtony239

Copy link
Copy Markdown
Contributor Author

@zhangtony239 I think padding is useful to give the content some room to breathe on larger widths. Let's try some variation of p-3.5 sm:p-10 — does that sound about right for you?

Indeed, it's time to add a condition to this CSS.

@zhangtony239

Copy link
Copy Markdown
Contributor Author
2025-04-29.235736.mp4

@sachasayan How about this?

@sachasayan

Copy link
Copy Markdown
Contributor

@zhangtony239 Love it. Let's ship this, but one minor nitpick:

Instead of: max-[370px]:p-3.5 p-10

Can you use: p-3.5 min-[370px]:p-10

Keeping responsible styles consistently bottom up means conflicts / bugs later if they occur and we get to build defaults to the narrow sizes. 😇

Sorry to nitpick, and this is a great catch! Thanks for the contribution! 👍

@sachasayan

Copy link
Copy Markdown
Contributor

@cte @mrubens Ready to ship once p-3.5 min-[370px]:p-10 is in. 🚀

@mrubens

mrubens commented Apr 30, 2025

Copy link
Copy Markdown
Collaborator

p-3.5 min-[370px]:p-10

I just noticed that this makes the p-10 take priority over the pt-5 for the top padding - is that intentional?

@mrubens

mrubens commented Apr 30, 2025

Copy link
Copy Markdown
Collaborator

Maybe we should just merge this as is

@sachasayan

Copy link
Copy Markdown
Contributor

@mrubens Let me check it out real quick.

@sachasayan

Copy link
Copy Markdown
Contributor

@mrubens It's fine as-is. Very little difference. I'll do another pass on this soon. I think you can just merge. :)

@dosubot dosubot Bot added the lgtm This PR has been approved by a maintainer label Apr 30, 2025
@mrubens mrubens merged commit 23977d0 into RooCodeInc:main Apr 30, 2025
@github-project-automation github-project-automation Bot moved this from PR [Pre Approval Review] to Done in Roo Code Roadmap Apr 30, 2025
mrubens pushed a commit that referenced this pull request May 1, 2025
mehmetsunkur pushed a commit to mehmetsunkur/Roo-Code that referenced this pull request May 16, 2025
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.

Labels

lgtm This PR has been approved by a maintainer size:XS This PR changes 0-9 lines, ignoring generated files.

Projects

None yet

Development

Successfully merging this pull request may close these issues.

5 participants